// - - - - - - - - - - Contact Styles - - - - - - - - - - //

.contact
  width: 100%
  height: 100vh
  min-height: 700px
  position: relative
  background-image: url(../img/bg_contact.jpg)
  background-size: cover
  background-position: center
  background-repeat: no-repeat
  overflow: auto

.container_contact
  position: absolute
  top: 50%
  left: 50%
  transform: translate(-50%,-50%)
  width: 960px
  max-width: 100%
  .form_title
    text-align: center
    text-transform: uppercase
    font-size: 1.2rem
    color: $white
    &::before,
    &::after
      content: " — "
  .form
    width: 90%
    margin: 0 auto
    .form_group
      margin-top: 3rem
      text-align: center
    input, textarea
      width: 100%
      padding: 1rem
      background-color: rgba(255, 255, 255, 0.4)
      color: $white
      font-weight: 300
      transition: all .35s ease-in-out
      &:focus
        background-color: rgba(191, 127, 127, 0.6)
    .form_btn
      width: inherit
      color: $white
      text-transform: uppercase
      outline: none
      border: none
      background-color: rgba(255, 255, 255, 0.4)
      padding: 1rem 3rem
      border-radius: 3rem
      cursor: pointer
      transition: all .3s ease-in-out
      &:hover
        background-color: rgba(191, 127, 127, 0.6)
        color: $white
      &:active
        transform: translateY(2px)